import React from 'react';
import ReactDOM from 'react-dom';
let ary = [1, 2, 3, 4, 5, 6, 7];
class App extends React.Component {
  // constructor() {
  //   super() // call 继承
  //   // this.fn2 = () => {
  //   //   console.log(this)
  //   // }
  // }
  fn() {
    console.log(this)
  }
  fn2 = () => {
    console.log(this)
  }
  fn3(item) {
    console.log(arguments)
  }
  fn4(item) {
    return () => {
      console.log(item)
    }
  }
  render() {
    // this 是当前实例
    // react的这种事件 我们一般成为 合成事件
    console.log(this)
    return <div className=''>
      <button onClick={this.fn.bind(this)}>按钮1</button>
      <button onClick={() => { this.fn() }}>按钮2</button>
      <button onClick={this.fn2}>按钮3</button>
      {
        ary.map(item => <button key={item} onClick={this.fn3.bind(this, item, 666, 888)}>{item}</button>)
      }
      {
        ary.map(item => <button key={item} onClick={(e) => { this.fn3(e, item, e, e) }}>{item}</button>)
      }
      {
        ary.map(item => <button key={item} onClick={this.fn4(item)}>{item}</button>)
      }
    </div>;
  }
}

ReactDOM.render(<App />, document.getElementById('root'))